<template>
  <a-float-button-group shape="circle" class="floating-button-group">
    <a-tooltip title="帮助">
      <a-float-button>
        <template #icon>
          <QuestionCircleOutlined />
        </template>
      </a-float-button>
    </a-tooltip>
    <a-tooltip title="消息">
      <a-float-button />
    </a-tooltip>
    <a-tooltip title="返回顶部">
      <a-back-top v-show="showBackTop" :visibility-height="0" />
    </a-tooltip>
  </a-float-button-group>
</template>

<script lang="ts" setup>
import { defineProps } from 'vue';
import { QuestionCircleOutlined } from '@ant-design/icons-vue';

const props = defineProps<{ showBackTop: boolean }>();
</script>

<style scoped>
.floating-button-group {
  position: fixed;
  bottom: 80px;
  right: 24px;
}
</style>
